<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>欢乐大转盘</title>

    <link href="../css/style.css" rel="stylesheet" type="text/css">
    <link href="../css/base.css" rel="stylesheet" type="text/css">

    <script type="text/javascript" src="../js/jquery-1.11.3.min.js"></script>
    <script type="text/javascript" src="../js/awardRotate.js"></script>
    <script type="text/javascript" src="../js/wheel.js"></script>
    <script type="text/javascript" src="../js/paramsTool.js"></script>
    <script src="../js/layer.js"></script>
    <style>
        .exptxt{margin-right:10px;}
        .exptxt ol{line-height:1.4; color:#505050; font-weight:bold; font-size:13px;}
        .exptxt ol li{ margin:10px 0 0 25px; list-style-type:decimal;width: 90%; text-align: left;}
    </style>

    <script type="text/javascript">
        var turnplate={
            restaraunts:[],				//大转盘奖品名称
            colors:[],					//大转盘奖品区块对应背景颜色
            outsideRadius:192,			//大转盘外圆的半径
            textRadius:155,				//大转盘奖品位置距离圆心的距离
            insideRadius:68,			//大转盘内圆的半径
            startAngle:0,				//开始角度

            bRotate:false				//false:停止;ture:旋转
        };
        var host = window.location.origin;
        var cost = 50;
        var add = 0;
        if(host == 'http://weblogin.178dn.net') host = 'http://tempa.178dn.net';
        $(document).ready(function(){

            setTimeout(function () {
                for(var i = 0;i<10;i++){
                    listNews();
                }

                setInterval(function () {
                    listNews();
                },1500);
            },Math.random() * 5000 + 1000);


            $("a").click(function(){

                if(turnplate.bRotate){
                    return false;
                }
            });
            //设置用户金币
            var userCoin = getCookie('coin') || 0;
            var uid =getCookie('wxopenid');
            var sid =getCookie('sid');

            $("#coinNum").html(userCoin);

            //动态添加大转盘的奖品与奖品区域背景颜色
            turnplate.restaraunts = [5,6,8,10,15,20,30,40,50,60];
            turnplate.colors = ["#FFF4D6", "#FFFFFF", "#FFF4D6", "#FFFFFF","#FFF4D6", "#FFFFFF", "#FFF4D6", "#FFFFFF","#FFF4D6", "#FFFFFF"];


            var rotateTimeOut = function (){
                $('#wheelcanvas').rotate({
                    angle:0,
                    animateTo:2160,
                    duration:8000,
                    callback:function (){
                        alert('网络超时，请检查您的网络设置！');
                    }
                });
            };

            //旋转转盘 item:奖品位置; txt：提示语;
            var rotateFn = function (item, selCoin,coinNum){
                var angles = item * (360 / turnplate.restaraunts.length) - (360 / (turnplate.restaraunts.length*2));
                if(angles < 270){
                    angles = 270 - angles;
                }else{
                    angles = 360 - angles + 270;
                }
                $('#wheelcanvas').stopRotate();
                $('#wheelcanvas').rotate({
                    angle:0,
                    animateTo:angles+1800,
                    duration:5000,
                    callback:function (){

                        setCookie('coin',coinNum);
                        $("#coinNum").html(coinNum);
                        turnplate.bRotate = !turnplate.bRotate;

                        if(selCoin > 10){
                            //询问框
                            layer.open({
                                content: '恭喜转到'+selCoin+'金币<br>传说中的藏宝图就在这里,立即前去探险!'
                                ,btn: ['好的','不要']
                                ,yes: function(index){
                                    location.href =host+'/view/fish.html';
                                    layer.close(index);
                                }
                            });
                        }else if(Math.random() > 0.5){
                            //询问框
                            layer.open({
                                content: '恭喜转到'+selCoin+'金币<br>丰厚奖品在等你,还犹豫什么呢?'
                                ,btn: ['忍不了了','还是拒绝']
                                ,yes: function(index){
                                    location.href =host+'/view/fish.html';
                                    layer.close(index);
                                }
                            });
                        }else {
                            //提示
                            layer.open({
                                content: '恭喜转到'+selCoin+'金币'
                                ,skin: 'msg'
                                ,time: 2 //2秒后自动关闭
                            });
                        }

                    }
                });
            };

            $('.pointer').click(function (){
                alert('功能已关闭,谢谢您的参与!');
                return;
                if(!userCoin || !uid){
//                    getWxCode();
                    userCoin = getCookie('coin');
                    uid =getCookie('wxopenid');
                    sid =getCookie('sid');
                    $("#coinNum").html(userCoin);
                }

                if(userCoin < cost){				//调支付
                    location.href=host+'/view/recharge.html';
                }else {							//大转盘

                    if(turnplate.bRotate)return;
                    turnplate.bRotate = !turnplate.bRotate;
                    userCoin = FloatAdd(userCoin,-cost);
                    $("#coinNum").html(userCoin);
                    $.ajax({
                        url: host+ "/turntable/rotateItem",
                        type: "get",
                        dataType:'json',
                        async:true,//请求是否异步，默认为异步，这也是ajax重要特性
                        cache:false,
                        headers: {"content-type":"application/json","uid":uid,"flag":3,"sid":sid},
                        success:function(data){

                            if(data.code){
                                layer.open({
                                    content: data.info
                                    ,skin: 'msg'
                                    ,time: 1.5 //2秒后自动关闭
                                });
                            }else {
                                var selCoin = turnplate.restaraunts[data.item-1];
                                userCoin = FloatAdd(userCoin,selCoin);
                                rotateFn(data.item,selCoin,userCoin);
                            }

                        },
                        error:function() {
                            layer.open({
                                content: '位置错误,请退出重试!'
                                ,skin: 'msg'
                                ,time: 1.5 //2秒后自动关闭
                            });
                        }
                    });
                }
            });

            $('#sharePage').click(function () {
                location.href = host+'/view/shareCode.html?referee='+uid;
            });

        });

        function exp(){
            layer.open({
                type: 1,
                title:[
                    '转盘规则',
                    'background-color:#cc3435; color:#fff; font-weight:bold;text-align:center;'
                ],
                content: '<div class="exptxt"><ol><li>充值会员每天签到可以领取金币</li><li>百万微货板块上传微货有金币领取</li><li>获取到的金币可以直接申请提现</li><li>获取到的金币可以直接申请提现</li></ol></div>',
                style: 'width:80%; height:250px;border:0px solid black; margin:0 auto; border-radius:6px;'
            });
        }

        function listNews(){
            var txt=null;
            var id =Math.floor(Math.random()*92999 +10000);  //10000-102999

            if(Math.random() > 0.4){
                add++;
                var turs = [9,30,35,50,60,70,80,80,100];
                var tur =turs[Math.floor(Math.random()*turs.length)];
                txt = '恭喜用户'+id+'转到了'+tur+'个金币!';
                $("<div style='height: 20px;'></div>").html(txt).appendTo($('#mar'));

            }else {
                add++;
                var cashs = [5,10,20,30,50,90];
                var cash =cashs[Math.floor(Math.random()*cashs.length)];
                txt = '恭喜用户'+id+'兑换了'+cash+'元红包!';
                $("<div style='height: 20px;'></div>").html(txt).appendTo($('#mar'));
            }

            if(add % 30 == 0){
                $("#mar div:lt(15)").remove();
                add = 15;
            }
        }

    </script>
</head>
<body style="background:#e62d2d;overflow-x:hidden;">
<img src="../image/coin27.png" id="shan-img" style="display:none;" />
<img src="../image/2.png" id="sorry-img" style="display:none;" />

<!--顶部导航-->
<div style="margin: 20px; text-align: right;font-size: 13px;color: whitesmoke;" onClick="exp()">
    转盘规则 >>
</div>


<!---大转盘--->
<div class="banner">
    <div class="turnplate" style="background-image:url(../image/turnplate-bg.png);background-size:100% 100%;">
        <canvas class="item" id="wheelcanvas" width="422px" height="422px"></canvas>
        <img class="pointer" src="../image/turnplate-pointer.png"/>
    </div>
</div>
<!--当前信息--->
<div class="user_coin">
    <div class="img"><img src="../image/bean27.png"></div>
    <div class="coin">当前金币:<label id="coinNum">30</label></div>
    <div class="tips">每次抽奖消耗20金币</div>
</div>

</body>
</html>